<template>
	<view class="app">
		<view style="color: red;">
			声明：本程序绝对不保存用户提交的证书信息，若你不放心，可以从【uniapp插件市场】或 【gitee仓库】 下载源码自己编译运行即可。
		</view>
		<view style="margin-top: 10px;">
			uniapp插件市场：<a href="https://ext.dcloud.net.cn/plugin?name=vk-get-cert-sn" target="_blank">https://ext.dcloud.net.cn/plugin?name=vk-get-cert-sn</a>
		</view>
		<view style="margin-top: 10px;">
			gitee仓库：<a href="https://gitee.com/vk-uni/vk-get-cert-sn.git" target="_blank">https://gitee.com/vk-uni/vk-get-cert-sn.git</a>
		</view>
		<view style="margin-top: 10px;"> 
			作者：VK，官方Q群：
			<!-- #ifdef H5 -->
			<a href="https://jq.qq.com/?_wv=1027&k=RTeqPXCZ">22466457</a>
			<!-- #endif -->
			 <!-- #ifndef H5 -->
			 22466457
			 <!-- #endif -->
		</view>
		<view style="margin-top: 10px;display: flex;">
			<textarea v-model="form.alipay.alipayRootCert" placeholder="请粘贴 alipayRootCert.crt 证书的内容到此处" :maxlength="999999999" ></textarea>
			<textarea v-model="form.alipay.appCert" placeholder="请粘贴 appCertPublicKey.crt 证书的内容到此处" style="margin-left: 20px;" :maxlength="999999999" ></textarea>
		</view>
		<view style="display: flex;justify-content: center;">
			<button @click="getAlipaySN">获取支付宝证书序列号</button>
		</view>
		<view class="data-view">
			支付宝返回结果：
			<text space="ensp" selectable user-select>{{ data.alipay }}</text>
		</view>
		<textarea v-model="form.wxpay.appCert" placeholder="请粘贴 apiclient_cert.pem 证书的内容到此处" :maxlength="999999999" ></textarea>
		<view style="display: flex;justify-content: center;">
			<button @click="getWxPaySN">获取微信支付证书序列号</button>
		</view>
		<view class="data-view">
			微信返回结果：
			<text space="ensp" selectable user-select>{{ data.wxpay }}</text>
		</view>
	</view>
</template>

<script>
const getSN = uniCloud.importObject("getSN");

export default {
	data() {
		return {
			form: {
				alipay: {
					alipayRootCert: "",
					appCert: ""
				},
				wxpay: {
					appCert: ""
				}
			},
			data: {
				alipay: {
					errCode: "",
					appCertSn: "",
					alipayRootCertSn: ""
				},
				wxpay: {
					errCode: "",
					appCertSn: ""
				}
			}
		};
	},
	onLoad() {},
	methods: {
		async getAlipaySN() {
			this.data.alipay = await getSN.getAlipaySN(this.form.alipay);
		},
		async getWxPaySN() {
			this.data.wxpay = await getSN.getWxPaySN(this.form.wxpay);
		}
	}
};
</script>

<style>
.app {
	padding: 15px;
	max-width: 900px;
	margin: 0 auto;
	font-size: 14px;
}
button {
	margin: 10px 0;
	width: 300px;
}
textarea {
	border: 1px solid #cccccc;
	width: 100%;
	font-size: 13px;
	padding: 5px 10px;
	box-sizing: border-box;
	flex: 1;
}
.data-view {
	background-color: #f6f8fa;
	color: #333;
	padding: 15px;
	overflow: auto;
	font-size: 13px;
	margin: 10px 0;
}
</style>
